/*
 * @Author: 肖思汗 
 * @Date: 2025-06-06 11:21:08 
 * @Last Modified by: 肖思汗
 * @Last Modified time: 2025-07-07 19:52:41
 */


.componentSelect {
    background: transparent;
    position: absolute;
    top: calc(420rpx + 100vw);
    left: 50%;
    transform: translate(-50%, 0%);

    &.disabled {
        pointer-events: none;
        opacity: 0.5;
    }

}

.arrowBtn {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: 70rpx;
    height: 70rpx;
    cursor: pointer;
    background-color: #FFFFFF;
    border-radius: 10rpx;
    box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.15);
}

.arrow {
    width: 20rpx;
    height: 20rpx;
    border-top: 4rpx solid #666;
    border-right: 4rpx solid #666;
    position: absolute;
    top: 22rpx;
    left: 22rpx;
    transform-origin: 50% 50%;

    &.left {
        transform: rotate(-135deg);
    }

    &.right {
        transform: rotate(45deg);
    }
}

.content {
    display: inline-flex;
    vertical-align: middle;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 40rpx;
}

.title {
    font-size: 32rpx;
    color: #000000;
    font-weight: bold;
    margin-bottom: 8rpx;
}

.subtitle {
    font-size: 24rpx;
    color: #666666;
}